package zzk.gwxer.tttttt.hanlan.ding.ui.screen

import android.util.Log
import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.core.tween
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.background
import androidx.compose.foundation.combinedClickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalConfiguration
import androidx.compose.ui.unit.dp
import zzk.gwxer.tttttt.hanlan.ding.MainActivity.Companion.TAG
import zzk.gwxer.tttttt.hanlan.ding.ui.entity.Player
import zzk.gwxer.tttttt.hanlan.ding.ui.component.CountdownTimer
import zzk.gwxer.tttttt.hanlan.ding.vm.MainViewModel

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun MainScreen(viewModel: MainViewModel) {
    val showSettings = viewModel.showSettings.collectAsState()
    val isTimerOn = viewModel.isTimerOn.collectAsState()
    val remainingTime = viewModel.remainingTime.collectAsState()
    var size = 20.dp

    Box(
        modifier = Modifier.fillMaxSize()
            .combinedClickable(
                onClick = {
                    if (isTimerOn.value) {
                        viewModel.stopTimer()
                        viewModel.nextPlayer()
                        viewModel.resetTimer()
                    } else {
                        if (remainingTime.value == 0) {
                            viewModel.resetTimer()
                            viewModel.nextPlayer()
                        } else {
                            viewModel.startTimer()
                        }
                    }
                },
                onLongClick = { viewModel.switchShowSettings() },
            )
    ) {
        viewModel.getAvailablePlayers().forEachIndexed { index, player ->
//            size = if (viewModel.getPlayer() == player) {
//                60.dp
//            } else {
//                20.dp
//            }
            Box(
                modifier = Modifier
                    .align(player.position)
                    .padding(50.dp)
                    .size(size)
                    .background(
                        color = player.color,
                        shape = CircleShape
                    )
            )
        }
        CountdownTimer(viewModel)
    }

    if (showSettings.value) {
        SettingDialog(viewModel) { viewModel.switchShowSettings() }
    }
}
